Graphical user interfaces (GUIs), while less common in the early days of computing, have become common place among computing applications. GUIs allow users to operate an underlying program, application or other system to accomplish some task or set of tasks through interactions with one or more visual components of the GUIs.
With the advances in hardware technologies, today's computer software including the GUIs must be adapted to run on a variety of computer systems to interact with users. However, delivering a beautiful and good usable user interface (UI) requires a lot of different ingredients, especially when the targeting platforms may include a variety of computing machines, for example, desktop computers, tablets computers, mobile devices, and touch pad devices.
GUIs are normally developed based on user interface guidelines. In order to achieve consistency and homogeneity of designs, user interface guidelines typically provide an exact description which objects may be used on an interface in which context. User interface guidelines usually contain sets of rules and corresponding examples for the application of the rules. The development of the rules depends heavily on results of user research, input from solution managers and customers, and—in many cases—also on the technology used for the implementation of the software product.
User interface designers apply those guidelines during the design process when creating user interface mockups and prototypes, and also apply those guidelines during the evaluation of implemented software products. Those prototypes can be validated and iteratively modified—while the guidelines also have to be followed during the modification and adaptation phases.
The finalized user interface prototypes are then handed over to development with expectation that the interface guidelines are followed by implementing the interface exactly as shown in the prototype. But frequently, the gaps between a prototyped and developed interface are quite significant. Those gaps then have to be removed in an additional step of evaluation and development. One reason for the gaps is the necessary translation from prototype to implemented interface. Translations done under time pressure typically yield incomplete and/or incorrect results. Another problem is that changes in the guidelines made during the development process always have an impact on the interface prototypes but don't have an impact on the corresponding implementation.
In the current approach to UI design, some ingredients are really hard to get in order to achieve high design quality. The most lacking and thus most critical ingredients are always related to time constraints, for example, limited time to understand Guidelines, to agree on different design opinions, to adjust Guideline changes to an UI, to test UIs, to provide one consistent UI for different technology platforms and devices, to create UI Mockup variants for choosing the best out of it, to fix UI implementation errors, and to create different UI flavors to match special user groups.
To make the matter worse, time for UI design work is always wasted because during a UI design process there are always a lot of different opinions about the quality of the design. There is no measurement of the UI usability available to get absolute measurement results. Different participants in UI design have different opinions about beautifulness and intuitive interaction design because everybody has different pictures in mind. These different pictures are error prone and lead to a lot of inconsistencies and mistakes during the mass production of user interfaces within a software vendor. Further, there is no straight forward communication between mockuped, implemented, and configured UI designs because the interfaces between the different media cannot talk to each other in a compatible way. Thus the entire design and development process costs too much time and money.
Moreover, the currently existing description languages, such as CSS, HTML and other scripting languages to code UI designs, always mix visual and interaction design within the coding. Focusing on these languages (programming languages) is development but not UI design. There is currently no clear separation between UI layout structure, visual appearance and dynamic interaction behavior. Accordingly, there is a need in the art to provide a common description language for UI design that may separate the UI layout structure, visual appearance from scripting language code that defines the dynamic interaction behavior.